<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="Copyright" content="Lucn" />
<title>lucn30收藏夹</title>

{load href="/static/jQuery/jquery-1.9.1.min.js,/static/jQuery/jquery-browser.js,/static/jQuery/jquery.contextMenu.js,/static/jQuery/jalert/jquery.alertify.js,/static/lucnUI/lucn.js,/static/uikit/css/uikit.css,/static/lucnUI/lucn.css,/static/jQuery/jalert/alertify.css" /}
<style>
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}
*{ margin:0; padding:0;}
p{ line-height:26px; margin:0;}
body{ padding:8px; color:#000; font-size:12px;}
table{border-collapse:collapse; margin-top:8px; width:100%}.editDz{ width:720px;}
dl{ margin:8px 0;}
dd{ font-size:14px; float:left; margin:5px 8px;}
dd a{ text-decoration:none; color:#666666}
dd img{ vertical-align: bottom; margin-right:6px;}
.gnHtml{ }
.gnHtml .son{width:400px; float:left;}
/*右键菜单*/
.context-menu
{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #f2f2f2;
border: 1px solid #999;
list-style-type: none;
margin: 0;
padding: 0;
}
.context-menu a
{
display: block;
padding: 3px;
text-decoration: none;
color: #333;
}
.context-menu a:hover
{
background-color: #666;
color: white;
}
/*右键菜单结束*/
</style>
</head>
<body>
<hr>
<h3 class="gn">功能↓</h3>
<div class="gnHtml clearfix">
<div class="son">
<p>名称：
<input name="title" type="text" id="title" value="" size="40" /></p>
<p>网址：
<input name="url" type="text" id="url" value="" size="40" /></p>
<p>分组：
<select id="class">
{volist name="list1" id="v"}
<option value="{$v.id}">{$v.title}</option>
{/volist}
</select></p>
<p>颜色：
<input name="color" type="text" id="color" value="#000000" size="40" /></p>
<p>备注：<textarea name="note" id="note" rows="" cols=""></textarea></p>
<p><input name="按钮" type="button" class="insert" value="增加" /></p>
</div>
<div class="son">
<p>名称：
<input name="classTitle" type="text" id="classTitle" value="" size="40" /></p>
<p>分组：
<select id="parentId">
<option value="0">--顶级</option>
{volist name="list1" id="v"}
<option value="{$v.id}">{$v.title}</option>
{/volist}
</select></p>
<p>排序：
<input name="sort_order" type="text" id="sort_order" value="" size="40" /></p>
<p><input name="按钮" type="button" class="insertClass" value="增加" /></p>
</div>
<div class="son">

<form class="form-hook" action="https://www.baidu.com/s" target="_blank">
<input class="input input-hook" type="text" autocomplete="off" maxlength="100" name="word">
<input type="submit" class="button button-hook" value="搜索一下">
<input type="hidden" name="tn" value="lucn30">
<input type="hidden" name="ie" value="utf-8">
<input type="hidden" name="ssl_sample" value="normal">
</form>

</div>
<div class="son">
<p><span id="clear">清理缓存</span></p>
</div>
</div>
<hr>
{volist name="list1" id="v" key="k"}
<dl data-id="{$v.id}" class="clearfix">
<dt data-id="{$v.id}" data-parentId="{$v.parentId}" data-sort_order="{$v.sort_order}">{$v.title}</dt>
{volist name="list2[$k-1]" id="v2"}
<dd id="{$v.id}_{$v2.id}"><a href="{$v2.url}" target="_blank" data-id="{$v2.id}" data-ico="{$v2.ico}" data-color="{$v2.fontcolor}" data-note="{$v2.note}" title="{$v2.title}"{if condition = "$v2['fontcolor']"} style="color:{$v2.fontcolor}"{/if}><img src="{$v2.ico}" width="16" height="16" />{$v2.title}</a></dd>
{/volist}
</dl>
{/volist}
<script>
$(document).ready(function(e){ 
$('.gn').click(function(){$(".gnHtml").toggle();});
$('.insertClass').click(function(){
	var ajaxStr = {};
	ajaxStr['field'] = 'id|title|parentId|sort_order|';
	ajaxStr['id'] = 'NULL';
	ajaxStr['title'] = $('#classTitle').val();
    ajaxStr['parentId'] = $('#parentId').val();
    ajaxStr['sort_order'] = $('#sort_order').val();
	$.ajax({  
              //url:'update.php?ac=add&db={$db}&tb={$tb2}',// 跳转到 action  
              url:'{:url($module.'/index/insert_class',array('db'=>$db,'tb'=>$tb2))}',// 跳转到 action   
              data: ajaxStr,
              type:'post',  
              cache:false,  
              dataType:'json',  
              success:function(data) {  
              if(data.a == 1 ){  
			  alertify.alert(data.b);
              }else{  
			  alertify.alert(data.b);
              } 
              },  
              error : function() {    
              alertify.alert('网络异常'); 
              }  
              });	

	});
$('.insert').click(function(){
	var ajaxStr = {};
	ajaxStr['field'] = 'id|title|url|fontcolor|class|note|';
	ajaxStr['id'] = 'NULL';
	ajaxStr['class'] = $('#class').val();
	ajaxStr['title'] = $('#title').val();
	ajaxStr['url'] = $('#url').val();
	ajaxStr['fontcolor'] = $('#color').val();
	ajaxStr['note'] = $('#note').val();
	$.ajax({  
              url:'{:url($module.'/index/insert',array('db'=>$db,'tb'=>$tb1))}',// 跳转到 action  
              data: ajaxStr,
              type:'post',  
              cache:false,  
              dataType:'json',  
              success:function(data) {  
              if(data.a == 1 ){  
			  alertify.alert(data.b);
              }else{  
			  alertify.alert(data.b);
              } 
              },  
              error : function() {    
              alertify.alert('网络异常'); 
              }  
              });	

	});
$('dd a').contextMenu('context-menu-1', {
' 编辑 ': {
click: function (element) { // element is the jquery obj clicked on when context menu launched
var editor;
editor = '<p id="id" data-id="'+element.attr("data-id")+'">ID：'+element.attr("data-id")+'</p><p>名称：<input type="text" name="title" id="title" value="'+element.attr("title")+'" /></p><p>颜色：<input type="text" name="color" id="color" value="'+element.attr("data-color")+'" /></p><p>网址：<input type="text" name="url" id="url" value="'+element.attr("href")+'" /></p><p>图标：<input type="text" name="ico" id="ico" value="'+element.attr("data-ico")+'" /></p><p>分类：<input type="text" name="class" id="class" value="'+element.parent().parent().attr("data-id")+'" /></p><p>备注：<textarea name="note" id="note" rows="" cols="">'+element.attr("data-note")+'</textarea></p><p><input type="button" value="提交" onclick="submit1()"/></p>';
alertify.alert(editor);
//$('.alertify-message').html(editor);
},
klass: "menu-item-1" // a custom css class for this menu item (usable for styling)
},
' 删除 ': {
click: function (element) {
    var ajaxStr = {};
	ajaxStr['field'] = 'id|display|';
	ajaxStr['id'] = element.attr("data-id");
	ajaxStr['display'] = 0;
	$.ajax({  
              url:'{:url($module.'/index/delete',array('db'=>$db,'tb'=>$tb1))}',// 跳转到 action    
			  data: ajaxStr,
              type:'post',  
              cache:false,  
              dataType:'json',  
              success:function(data) {  
              if(data.a == 1 ){  
			  alertify.alert('删除成功，'+data.b);
              }else{  
			  alertify.alert('删除失败，'+data.b);
              } 
              },  
              error : function() {    
              alert("网络异常");  
              }  
              });	

},
klass: "second-menu-item"
}
});

$('dt').contextMenu('context-menu-2', {
' 编辑分类 ': {
click: function (element) { // element is the jquery obj clicked on when context menu launched
var editor;
editor = '<p id="id" data-id="'+element.attr("data-id")+'">ID：'+element.attr("data-id")+'</p><p>名称：<input type="text" name="title" id="title" value="'+element.text()+'" /></p><p>父系：<input type="text" name=parentId" id="parentId" value="'+element.attr("data-parentId")+'" /></p><p>排序：<input type="text" name=sort_order" id="sort_order" value="'+element.attr("data-sort_order")+'" /></p><p><input type="button" value="提交" onclick="submit2()"/></p>';
alertify.alert(editor);
//$('.alertify-message').html(editor);
},
klass: "menu-item-2" // a custom css class for this menu item (usable for styling)
},
' 删除分类 ': {
click: function (element) {
    var ajaxStr = {};
	ajaxStr['field'] = 'id|display|';
	ajaxStr['id'] = element.attr("data-id");
	ajaxStr['display'] = 0;
	$.ajax({  
              //url:'update.php?ac=updata&db={$db}&tb={$tb2}',// 跳转到 action
			  url:'{:url($module.'/index/delete_class',array('db'=>$db,'tb'=>$tb2))}',// 跳转到 action  
			  data: ajaxStr,
              type:'post',  
              cache:false,  
              dataType:'json',  
              success:function(data) {  
              if(data.a == 1 ){  
			  alertify.alert(data.b);
              }else{  
			  alertify.alert(data.b);
              } 
              },  
              error : function() {    
              alert("网络异常");  
              }  
              });	

},
klass: "menu-item-3"
}
});

}); //document ready
function submit1(){
	var ajaxStr = {};
	ajaxStr['field'] = 'id|title|url|ico|class|fontcolor|note';
	ajaxStr['id'] = $('.alertify-inner #id').attr('data-id');
	ajaxStr['title'] = $('.alertify-inner #title').val();
	ajaxStr['url'] = $('.alertify-inner #url').val();
	ajaxStr['ico'] = $('.alertify-inner #ico').val();
	ajaxStr['class'] = $('.alertify-inner #class').val();
	ajaxStr['note'] = $('.alertify-inner #note').val();
	ajaxStr['fontcolor'] = $('.alertify-inner #color').val();
	         $.ajax({  
             // url:'update.php?ac=updata&db={$db}&tb={$tb1}',// 跳转到 action    
			  url:'{:url($module.'/index/update',array('db'=>$db,'tb'=>$tb1))}',// 跳转到 action    
			  data: ajaxStr,
              type:'post',  
              cache:false,  
              dataType:'json',  
              success:function(data) {  
              if(data.a == 1 ){  
			  $(".alertify-inner .alertify-message").nextUntil(".alertify-buttons").html(data.b);
			  //$('.alertify-inner *:not(.alertify-buttons)').html(data.b);
			  //var html = '<a href="'+ajaxStr['url']+'" target="_blank" data-id="'+ajaxStr['id']+'" data-ico="'+ajaxStr['ico']+'" title="'+ajaxStr['title']+'" style="color:'+ajaxStr['color']+'"><img src="'+ajaxStr['ico']+'" width="16" height="16">'+ajaxStr['title']+'</a>';
			  //$("#"+ajaxStr['class1']+'-'+ajaxStr['id']).html(html);
			  //$('#alertify').delay(2000).hide(0);
			  //$('#alertify-cover').delay(2000).hide(0);
              }else{  
              //修改失败
			  alert(data.b);
              } 
              },  
              error : function() {    
              alert("网络异常");  
              }  
              });	
	}
function submit2(){
	var ajaxStr = {};
	ajaxStr['field'] = 'id|title|parentId|sort_order|';
	ajaxStr['id'] = $('.alertify-inner #id').attr('data-id');
	ajaxStr['title'] = $('.alertify-inner #title').val();
	ajaxStr['parentId'] = $('.alertify-inner #parentId').val();
    ajaxStr['sort_order'] = $('.alertify-inner #sort_order').val();
	         $.ajax({  
              //url:'update.php?ac=updata&db={$db}&tb={$tb2}',// 跳转到 action    
              url:'{:url($module.'/index/update_class',array('db'=>$db,'tb'=>$tb2))}',// 跳转到 action      
			        data: ajaxStr,
              type:'post',  
              cache:false,  
              dataType:'json',  
              success:function(data) {  
              if(data.a == 1 ){  
			  $(".alertify-inner .alertify-message").nextUntil(".alertify-buttons").html(data.b);
			  //$('.alertify-inner *:not(.alertify-buttons)').html(data.b);
			  //var html = '<a href="'+ajaxStr['url']+'" target="_blank" data-id="'+ajaxStr['id']+'" data-ico="'+ajaxStr['ico']+'" title="'+ajaxStr['title']+'" style="color:'+ajaxStr['color']+'"><img src="'+ajaxStr['ico']+'" width="16" height="16">'+ajaxStr['title']+'</a>';
			  //$("#"+ajaxStr['class1']+'-'+ajaxStr['id']).html(html);
			  //$('#alertify').delay(2000).hide(0);
			  //$('#alertify-cover').delay(2000).hide(0);
              }else{  
              //修改失败
			  alert(data.b);
              } 
              },  
              error : function() {    
              alert("网络异常");  
              }  
              });	
	}
	$('#clear').click(function(){
	    $.ajax({  
              url:'{:url($module.'/index/ajax_clear')}',// 跳转到 action      
              type:'get',  
              cache:false,  
              dataType:'json',  
              success:function(data) {  
                if(data.a == 1 ){  
				    alert(data.b);
			        location.reload();
                }else{  
			        alert(data.b);
                } 
              } 
	    });
	});
</script>
</body>
</html>